<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>${htmltitle}</title>
<link rel="stylesheet" href="${ctx}/static/css/style.default.css" type="text/css" />
<link rel="stylesheet" href="${ctx}/static/css/style.blueline.css" type="text/css" />
<script type="text/javascript" src="${ctx}/static/js/plugins/jquery-1.7.min.js"></script>
<script type="text/javascript" src="${ctx}/static/js/plugins/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="${ctx}/static/js/plugins/jquery.cookie.js"></script>
<script type="text/javascript" src="${ctx}/static/js/plugins/jquery.uniform.min.js"></script>
<script type="text/javascript" src="${ctx}/static/js/plugins/jquery.smartWizard-2.0.min.js"></script>
<script type="text/javascript" src="${ctx}/static/js/plugins/jquery.colorbox-min.js"></script>
<script type="text/javascript" src="${ctx}/static/js/custom/general.js"></script>
<script type="text/javascript" src="${ctx}/static/js/custom/exam.js"></script>
<script type="text/javascript">
	jQuery(document).ready(function(){
		// Smart Wizard 	
  		jQuery('#wizard').smartWizard({onFinish: onFinishCallback});
		
		function onFinishCallback(){
			alert('Finish Clicked');
			jQuery('#exam').submit();
		} 
		
		jQuery(".inline").colorbox({inline:true, width: '60%', height: '500px'});
		
		jQuery('select, input:checkbox').uniform();
	});
</script>
<!--[if IE 9]>
    <link rel="stylesheet" media="screen" href="css/style.ie9.css"/>
<![endif]-->
<!--[if IE 8]>
    <link rel="stylesheet" media="screen" href="css/style.ie8.css"/>
<![endif]-->
<!--[if lt IE 9]>
	<script src="js/plugins/css3-mediaqueries.js"></script>
<![endif]-->
</head>

<body class="withvernav">

<div class="bodywrapper">
    <div class="topheader">
        <div class="left">
            <h1 class="logo"><span> 中国煤炭工业协会培训中心</span>&nbsp;&nbsp;培训系统</h1>
            
            <br clear="all" />
            
        </div><!--left-->
        
        <div class="right">
        
            <shiro:guest>
            <div style="float:left;line-height:40px;">
                <span><a href="${ctx}/user/login" style="font-size:14px;color:#999;">登录</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
            </div><!--userinfo-->
            </shiro:guest>
            
            <shiro:user>
            <div class="userinfo">
            	<img src="${ipath}/${user.avatar}" alt="" style="width:23px;height:23px;" />
                <span>${user.acct}</span>
            </div><!--userinfo-->
            
            <div class="userinfodrop">
            	<div class="avatar">
                	<a href=""><img src="${ipath}/${user.avatar}" alt="" style="width:95px;" /></a>
                </div><!--avatar-->
                <div class="userdata">
                	<h4>${user.acct}</h4>
                    <span class="email"></span>
                    <ul>
                    	<li><a href="${ctx}/user/pass">修改密码</a></li>
                    	<li><a href="${ctx}/user/edit">修改个人资料</a></li>
                    	<li><a href="${ctx}/user/upload">上传照片</a></li>
                        <li><a href="${ctx}/user/logout">退出</a></li>
                    </ul>
                </div><!--userdata-->
            </div><!--userinfodrop-->
            </shiro:user>
            
        </div><!--right-->
    </div><!--topheader-->
    
    
    <div class="header">
    	<ul class="headermenu">
        	<li><a href="${ctx}"><span class="icon icon-flatscreen"></span>首页</a></li>
        	<li><a href="${ctx}/proj/"><span class="icon icon-speech"></span>课程</a></li>
        	<li class="current"><a href="${ctx}/study/"><span class="icon icon-chart"></span>学习</a></li>
        	<li><a href="${ctx}/notice/"><span class="icon icon-message"></span>信息</a></li>
        	<li><a href="${ctx}/user/"><span class="icon icon-pencil"></span>个人</a></li>
        </ul>        
    </div><!--header-->
    
    <!--leftmenu-->
    <div class="vernav">
    	<ul>
        	<li class="current"><a href="${ctx}/study/">学习</a></li>
        	<li><a href="${ctx}/exam/">考试</a></li>
         	<li><a href="${ctx}/select/">选课</a></li>
        </ul>
        <a class="togglemenu"></a>
        <br /><br />
    </div><!--leftmenu-->
        
    <div class="centercontent">
    
        <div class="pageheader notab">
            <h1 class="pagetitle">考试</h1>
            <span class="pagedesc">
                <a href="${ctx}/exam/" class="btn btn_link" style="width:120px;"><span>返回考试列表</span></a>
            </span>
            
            <br/><br/>
            
            <span class="pagedesc">
                <span style="font-size:15px;">距离考试结束还有：</span>
                <span id="time" style="font-size:15px;color:#FF0000;">00 时 : 00 分 : 00 秒</span>
            </span>
        </div><!--pageheader-->
        
        <div id="contentwrapper" class="contentwrapper">
        
        	<div class="subcontent">
                    <!-- START OF DEFAULT WIZARD -->
                    <form class="stdform" id="exam" method="post" action="">
                    <div id="wizard" class="wizard">
                        
                        <ul class="hormenu" style="display:none;">
                            <c:forEach items="${data}" var="exam1">
                            <li>
                            	<a href="#wiz1step${exam1.seq}">
                                	<span class="h2">Step 1</span>
                                    <span class="dot"><span></span></span>
                                    <span class="label">Basic Information</span>
                                </a>
                            </li>
                            </c:forEach>
                        </ul>
                        
                        <c:forEach items="${data}" var="exam">
                        <div id="wiz1step${exam.seq}" class="formwiz">
                        	<h4>第 ${exam.seq} 题 
                        	    <c:if test="${exam.type eq 1}">（单选题）</c:if>
                        	    <c:if test="${exam.type eq 2}">（多选题）</c:if>
                        	    <c:if test="${exam.type eq 3}">（判断题）</c:if>
                        	</h4>
                        	
                                <p style="margin-left:30px;">${exam.question}</p>
                                
                                <c:forEach items="${exam.list}" var="answer">
                                <c:if test="${exam.type ne 2}">
                                <p style="margin-left:30px;">
                                    <c:if test="${answer.correct eq 0}">
                                    <input type="radio" name="${exam.id}" id="${exam.id}" value="${answer.id}" checked="checked" />&nbsp;&nbsp;${answer.answer}
                                    </c:if>
                                    <c:if test="${answer.correct ne 0}">
                                    <input type="radio" name="${exam.id}" id="${exam.id}" value="${answer.id}" />&nbsp;&nbsp;${answer.answer}
                                    </c:if>
                                </p>
                                </c:if>
                                <c:if test="${exam.type eq 2}">
                                <p style="margin-left:30px;">
                                    <c:if test="${answer.correct eq 0}">
                                    <input type="checkbox" name="${exam.id}" id="${exam.id}" value="${answer.id}" checked="checked" />&nbsp;&nbsp;${answer.answer}
                                    </c:if>
                                    <c:if test="${answer.correct ne 0}">
                                    <input type="checkbox" name="${exam.id}" id="${exam.id}" value="${answer.id}" />&nbsp;&nbsp;${answer.answer}
                                    </c:if>
                                </p>
                                </c:if>
                                </c:forEach>
                                                                
                        </div><!--#wiz1step1-->
                        </c:forEach>
                        
                        <input type="text" name="stuId" value="${stuId}" style="display:none;" />
                        
                    </div><!--#wizard-->
                    </form>
                    <!-- END OF DEFAULT WIZARD -->
                    
                    <br /><br />
                    
            </div><!-- #default -->
            
        </div><!--contentwrapper-->
        
	</div><!-- centercontent -->
    
    
</div><!--bodywrapper-->

</body>
</html>
